@import '../../../styles.less';

.popup{
    display: flex;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 99999;

    .bg{
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        background: rgba(0,0,0, .2);
        z-index: -1;
    }
    .popup-content{
        overflow: hidden;
        flex: 1 1;
        min-height: 100*@rem;
        background: @bgColor;
    }

    &.top{
        align-items: flex-start;
        .popup-content{
            border-bottom-left-radius: @radiusDef;
            border-bottom-right-radius: @radiusDef;
        }
    }

    &.bottom{
        align-items: flex-end;
        .popup-content{
            border-top-left-radius: @radiusDef;
            border-top-right-radius: @radiusDef;
        }
       
    }

    &.center{
        .popup-content{
            border-radius: @radiusDef;
        }
        align-items: center;
    }
}

